<html>
    <head>
        <meta charset = "utf-8">
        <title></title>
        <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
        <script src="https://cdn.staticfile.org/axios/0.18.0/axios.min.js"></script>
        <link href="https://cdn.jsdelivr.net/npm/@mdi/font@5.x/css/materialdesignicons.min.css" rel="stylesheet">
        <link href="https://cdn.jsdelivr.net/npm/vuetify@2.x/dist/vuetify.min.css" rel="stylesheet">
        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no, minimal-ui">
        <script src="https://cdn.jsdelivr.net/npm/vuetify@2.x/dist/vuetify.js"></script>
<!--        <script src="./static/fabric.js"></script>-->
    </head>
    <body>

        <div id="app">
        <v-app>
            <div v-show="username === ''">
                <v-toolbar color="primary" dark flat>
                    <v-toolbar-title>NB507----注册/登录</v-toolbar-title>
                </v-toolbar>
                <br><br><br>
                <v-row align="center" justify="center">
                    <v-col cols="3">
                        <v-text-field label="用户名" prepend-icon="mdi-account" type="text" v-model="usernameI"></v-text-field>
                        <v-text-field label="密码" prepend-icon="mdi-lock" type="password" v-model="passwordI"></v-text-field>
                        <br>
                        <v-row align="center" justify="space-around">
                            <v-btn v-on:click="signIn">登录</v-btn>
                            <v-btn v-on:click="signUp">注册</v-btn>
                        </v-row>
                    </v-col>
                </v-row>
            </div>
            <div v-show="username != ''">
                <v-toolbar color="primary" dark flat>
                    <v-toolbar-title>NB507----{{ username }}的个人页面，分数：{{ score }}</v-toolbar-title>
                </v-toolbar>
            </div>
        </v-app>
        </div>

        <script type="text/javascript">
            var vData = new Vue({
                el: '#app',
                vuetify: new Vuetify(),
                data:{
                    usernameI: '',
                    passwordI: '',
                    username: '',
                    roomnameI: '',
                    roomname: '',
                    roomOwner: '',
                    roomUserList: [],
                },
                methods:{
                    
                }
            })
        </script> 
    </body>
</html>